<template>
	<div class="admin">
		<div class="left">
			<el-row class="tac">
				<el-col :span="12">
					<h5>卡劵服务</h5>
					<el-menu :router="true" default-active="2" class="el-menu-vertical-demo">
						<el-menu-item index="/home/Cardservice/setween" @click="$router.push('setween')">
							<span slot="title" class="dian">我的电子劵</span>
						</el-menu-item>
						<el-menu-item index="/home/Cardservice/prepaid" @click="$router.push('prepaid')">
							<span slot="title" class="dian">平安健康卡</span>
						</el-menu-item>
						<el-menu-item index="/home/Cardservice/safe_healthy" @click="$router.push('safe_healthy')">
							<span slot="title" class="dian">预付卡</span>
						</el-menu-item>
					</el-menu>
				</el-col>
			</el-row>
			<h1></h1>
		</div>
		<div class="right">
			<router-view></router-view>
		</div>
	</div>
</template>

<script>


</script>

<style lang="less">
	.left ul {
		width: 150px;
	}

	el-submenu__title {
		width: 150px;
		line-height: 50px;
	}

	.el-menu {
		width: 150px;
		background-color: #eaedf2;
	}

	h5 {
		width: 150px;
		height: 90px;
		text-align: center;
		line-height: 90px;

	}

	.active {
		color: red;
	}

	* {
		margin: 0;
		padding: 0;
	}

	a {
		text-decoration: none;
	}

	.admin {
		width: 100vw;
		height: 100vh;
		display: flex;

		.left {
			height: 100%;
			width: 150px;
			background-color: #eaedf2;

			p {
				font-weight: 800;
				width: 150px;
				height: 90px;
				line-height: 90px;
				text-align: center;
			}

			li {
				width: 150px;
				height: 50px;
				text-align: center;
				line-height: 50px;
				cursor: pointer;
			}
		}

		.right {
			flex: 1;
		}
	}
</style>
